<template>
    <div class="chart-container">
        <remote-js src="//g.alicdn.com/sd/smartCaptcha/0.0.1/index.js"></remote-js>
        <chart id="SankeyEchart" :height="data.options.height+'px'" :data="data" :width="data.options.width+'px'" :options="data.options"/>
    </div>
</template>

<script>
import {getNewEcharts} from '@/api/api'
import Chart from '@/components/Charts/index'
export default {
    name: 'SankeyEchart',
    props: {
        data:{
            type: Object
        }
    },
    watch: {
        'data.options.sourceId': {
            handler() {
                this._getNewEcharts()
            },
        },
    },
    components: { 
        Chart,
        'remote-js': {
            render(createElement) {
                return createElement('script', {attrs: {type: 'text/javascript', src: this.src}});
            },
            props: {
                src: { type: String, required: true}
            }
        }
    },
    data() {
        return {
            
        }
    },
    methods: {
        _getNewEcharts(){
            const parms = {
                echartType:"pie",
                sourceId:this.data.options.sourceId
            }
            getNewEcharts(parms).then(res=>{
                if(res.rcode=='0000'){
                    this.data.options.series[0].data = res.data.seriesData
                    this.data.options.legend.data = res.data.legendData
                    
                }
            })
        }
    }
}
</script>
